import React from 'react';

export default function useRefs() {
  // 使用 useRef 创建一个引用数组，初始化为空数组
  const refs = React.useRef([]);

  // 使用 useCallback 创建一个记忆化的 setRefs 函数
  // 这个函数接受一个索引，并返回另一个函数，该函数接受一个 HTMLDivElement 并将其设置到引用数组的相应索引位置
  const setRefs = React.useCallback(
    (index) => (el) => {
      if (el) refs.current[index] = el;
    },
    []
  );

  // 使用 useCallback 创建一个记忆化的 reset 函数
  // 这个函数将引用数组重置为空数组
  const reset = React.useCallback(() => {
    refs.current = [];
  }, []);

  // 返回引用数组、setRefs 函数和 reset 函数作为一个数组
  // 注意：在 TypeScript 版本中，setRefs 被显式地转换为 any 类型以避免类型错误
  // 在 JavaScript 中，我们不需要这样做，但为了保持与原始代码的相似性，我们可以保留这种结构
  // 实际上，在 JavaScript 中使用时，调用者不需要知道 setRefs 的确切类型
  return [refs.current, setRefs, reset];
}
